<template>
  <div class="container">
    <div class="infoContent">
      <el-form
        :model="ruleForm"
        :rules="rules"
        ref="ruleForm"
        label-width="100px"
        class="demo-ruleForm"
      >
        <el-row>
          <el-col :span="12">
            <el-form-item label="单位名称" prop="name">
              <el-input
                class="inputStyle"
                :disabled="isDisabled"
                v-model.trim="ruleForm.name"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="统一社会信用代码">
              <el-input
                class="inputStyle"
                :disabled="true"
                v-model.trim="ruleForm.uscc"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="单位类型" prop="departmentType">
              <el-select
                v-model.trim="ruleForm.departmentType"
                clearable
                filterable
                placeholder="请选择"
                :disabled="isDisabled"
              >
                <el-option label="企业" :value="0"></el-option>
                <el-option label="事业单位" :value="5"></el-option>
                <el-option label="其他" :value="10"></el-option>
                <el-option label="个体工商户" :value="15"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="所属行业" prop="industryId">
              <el-cascader
                ref="industry"
                v-model="ruleForm.industryId"
                :options="industryOptionsNC"
                :props="{ checkStrictly: true }"
                :disabled="isDisabled"
                clearable
                filterable
              ></el-cascader>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-col :span="8" class="labelStyMin">
              <el-form-item label="归属" prop="belongs">
                <el-select
                  class="areasSelect"
                  v-model.trim="ruleForm.belongs"
                  :disabled="isDisabled"
                  clearable
                  filterable
                  placeholder="请选择"
                  @change="changeBelong"
                >
                  <el-option
                    v-for="item in belongsArr"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="10" class="labelStyMax">
              <el-form-item label="注册区域" prop="regAreaId">
                <!-- <el-input :disabled="isDisabled"  v-model.trim="ruleForm.regAreaName"></el-input> -->
                <el-cascader
                  ref="regAreas"
                  class="areasSelect"
                  v-model="ruleForm.regAreaId"
                  :key="isShowRegArea"
                  :options="regAreasOptions"
                  @change="handerChange"
                  clearable
                  filterable
                  placeholder="请选择注册区域"
                  :disabled="isDisabled"
                ></el-cascader>
              </el-form-item>
            </el-col>
          </el-col>
          <el-col :span="12">
            <!-- <el-form-item label="经营区域" >
                            <el-input :disabled="isDisabled" class="inputStyle"  v-model.trim="ruleForm.bizAreaName"></el-input>
                        </el-form-item> -->
            <el-form-item
              label="经营区域"
              prop="bizAreaId"
              v-if="ruleForm.belongs == '2'"
            >
              <el-cascader
                ref="manageAreas"
                class="inputStyle"
                :key="isShowManaArea"
                v-model="ruleForm.bizAreaId"
                :options="areasOptions"
                clearable
                filterable
                placeholder="请选择经营地址"
                :disabled="isDisabled"
              ></el-cascader>
            </el-form-item>
            <el-form-item label="经营区域" prop="address" v-else>
              <!-- <el-input v-model.trim="ruleForm.address" placeholder="请输入经营地址" disabled @blur="ruleForm.address = changeValue($event)"></el-input> -->
              <el-cascader
                ref="address"
                class="inputStyle"
                :key="isShowManaArea"
                v-model="ruleForm.address"
                :options="areasOptions"
                clearable
                filterable
                placeholder="请选择经营地址"
                disabled
              ></el-cascader>
            </el-form-item>
          </el-col>
        </el-row>
        <template v-if="ruleForm.departmentType === 0">
          <el-row>
            <el-col :span="12" style="position: relative">
              <el-form-item label="企业类型" prop="companyType">
                <el-select
                  v-model.trim="ruleForm.companyType"
                  clearable
                  filterable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in companyTypeArr"
                    :key="item.code"
                    :label="item.name"
                    :value="item.code"
                  ></el-option>
                </el-select>
              </el-form-item>
              <div
                style="
                  position: absolute;
                  top: 0;
                  right: 25%;
                  padding-right: 10px;
                "
              >
                <el-button
                  type="text"
                  @click="getApiInfo"
                  class="commonBut"
                  style="width: auto"
                  :loading="updateLoading"
                  >获取最新接口信息</el-button
                >
                <el-tooltip
                  content="获取单位最新的工商总局注册信息填充"
                  placement="top"
                  effect="dark"
                >
                  <i
                    class="icon iconfont iconhuabanfuben"
                    style="color: #409eff"
                  ></i>
                </el-tooltip>
              </div>
            </el-col>
            <el-col :span="12">
              <el-form-item label="状态" prop="status">
                <el-select
                  v-model.trim="ruleForm.status"
                  clearable
                  filterable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in statusArr"
                    :key="item.code"
                    :label="item.name"
                    :value="item.code"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="经济类型" prop="economicType">
                <el-select
                  v-model.trim="ruleForm.economicType"
                  clearable
                  filterable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in economicTypeArr"
                    :key="item.code"
                    :label="item.name"
                    :value="item.code"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="隶属关系" prop="affiliation">
                <el-select
                  v-model.trim="ruleForm.affiliation"
                  clearable
                  filterable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in affiliationArr"
                    :key="item.code"
                    :label="item.name"
                    :value="item.code"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="是否劳务派遣单位" prop="isLaborDispatch">
                <el-select
                  v-model.trim="ruleForm.isLaborDispatch"
                  clearable
                  filterable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in isEnum"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否已建立工会" prop="isUnionize">
                <el-select
                  v-model.trim="ruleForm.isUnionize"
                  clearable
                  filterable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in isEnum"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="是否签订集体合同" prop="isContract">
                <el-select
                  v-model.trim="ruleForm.isContract"
                  clearable
                  filterable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in isEnum"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否签订集体协议" prop="isProtocol">
                <el-select
                  v-model.trim="ruleForm.isProtocol"
                  clearable
                  filterable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in isEnum"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
        </template>
        <el-row v-if="ruleForm.departmentType !== 15">
          <el-col :span="12" style="position: relative">
            <el-col :span="8" class="labelStyMin">
              <el-form-item label="法人姓名" prop="boss">
                <el-input
                  v-model.trim="ruleForm.boss"
                  clearable
                  placeholder="请输入"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="10" class="labelStyMax">
              <el-form-item label="法人联系方式" prop="bossTel">
                <el-input
                  v-model.trim="ruleForm.bossTel"
                  clearable
                  placeholder="请输入"
                ></el-input>
              </el-form-item>
            </el-col>
            <div
              style="position: absolute; top: 36px; left: 75%"
              v-if="
                ruleForm.departmentType === 5 || ruleForm.departmentType === 10
              "
            >
              <el-button
                type="primary"
                @click="getApiInfo"
                class="commonBut saveBtn"
                :loading="updateLoading"
                >获取最新接口信息</el-button
              >
              <el-tooltip
                content="获取单位最新的国家编办注册信息填充"
                placement="top"
                effect="dark"
              >
                <i class="icon iconfont iconhuabanfuben"></i>
              </el-tooltip>
            </div>
          </el-col>
          <el-col :span="12">
            <el-form-item label="法人身份证号" prop="bossIdcard">
              <el-input
                class="inputStyle"
                v-model.trim="ruleForm.bossIdcard"
                clearable
                placeholder="请输入"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <template
          v-if="ruleForm.departmentType === 5 || ruleForm.departmentType === 10"
        >
          <el-row>
            <el-col :span="12">
              <el-col :span="10" style="padding-left: 0px">
                <el-form-item label="证书有效期起" prop="expiryStartDate">
                  <el-date-picker
                    type="date"
                    placeholder="请选择"
                    class="proInputWidth"
                    v-model="ruleForm.expiryStartDate"
                    @change="getTimeValue"
                    value-format="yyyy-MM-dd"
                    clearable
                  ></el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="10" style="padding-left: 0px">
                <el-form-item label="证书有效期止" prop="expiryEndDate">
                  <el-date-picker
                    type="date"
                    placeholder="请选择"
                    class="proInputWidth"
                    v-model="ruleForm.expiryEndDate"
                    @change="getTimeValue"
                    value-format="yyyy-MM-dd"
                    clearable
                  ></el-date-picker>
                </el-form-item>
              </el-col>
            </el-col>
            <el-col :span="12">
              <el-form-item label="经费来源" prop="fundsSources">
                <el-input
                  class="inputStyle"
                  show-word-limit
                  maxlength="100"
                  placeholder="请输入经费来源"
                  v-model.trim="ruleForm.fundsSources"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="举办单位">
                <el-input
                  class="inputStyle"
                  show-word-limit
                  maxlength="100"
                  placeholder="请输入举办单位"
                  v-model.trim="ruleForm.sponsor"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="开办资金" prop="initialFund">
                <el-input
                  class="inputStyle"
                  v-model.trim="ruleForm.initialFund"
                  clearable
                  placeholder="请输入"
                ></el-input
                >&nbsp;万元
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="宗旨和业务范围">
                <el-input
                  class="inputStyle"
                  show-word-limit
                  maxlength="500"
                  placeholder="请输入宗旨和业务范围"
                  v-model.trim="ruleForm.bussniseeScope"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否已建立工会" prop="isUnionize">
                <el-select
                  v-model.trim="ruleForm.isUnionize"
                  clearable
                  filterable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in isEnum"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="登记住所">
                <el-input
                  class="inputStyle"
                  show-word-limit
                  maxlength="100"
                  placeholder="请输入登记住所"
                  v-model.trim="ruleForm.registerAddress"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否签订集体合同" prop="isContract">
                <el-select
                  v-model.trim="ruleForm.isContract"
                  clearable
                  filterable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in isEnum"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="实际地址">
                <el-input
                  class="inputStyle"
                  show-word-limit
                  maxlength="100"
                  placeholder="请输入实际地址"
                  v-model.trim="ruleForm.officeAddress"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否签订集体协议" prop="isProtocol">
                <el-select
                  v-model.trim="ruleForm.isProtocol"
                  clearable
                  filterable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in isEnum"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-col :span="8" class="labelStyMin">
                <el-form-item label="联系人姓名" prop="transactor">
                  <el-input
                    v-model.trim="ruleForm.transactor"
                    clearable
                    placeholder="请输入"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="10" class="labelStyMax">
                <el-form-item label="联系人联系方式" prop="transactorTel">
                  <el-input
                    v-model.trim="ruleForm.transactorTel"
                    clearable
                    placeholder="请输入"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-col>
            <el-col :span="12">
              <el-col :span="8" class="labelStyMin">
                <el-form-item label="座机号码" prop="landlineTelHead">
                  <el-input
                    v-model.trim="ruleForm.landlineTelHead"
                    clearable
                    placeholder="请输入"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="10" class="labelStyMax">
                <el-form-item label=" " prop="landlineTelNum">
                  <el-input
                    v-model.trim="ruleForm.landlineTelNum"
                    clearable
                    placeholder="请输入"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-col>
          </el-row>
        </template>
        <template v-if="ruleForm.departmentType === 15">
          <el-row>
            <el-col :span="12">
              <el-col :span="8" class="labelStyMin">
                <el-form-item label="经营者姓名" prop="boss">
                  <el-input
                    v-model.trim="ruleForm.boss"
                    clearable
                    placeholder="请输入"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="10" class="labelStyMax">
                <el-form-item label="经营者手机号" prop="bossTel">
                  <el-input
                    v-model.trim="ruleForm.bossTel"
                    clearable
                    placeholder="请输入"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-col>
            <el-col :span="12">
              <el-form-item label="登记地址">
                <el-input
                  class="inputStyle"
                  show-word-limit
                  maxlength="100"
                  placeholder="请输入登记地址"
                  v-model.trim="ruleForm.registerAddress"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="注册日期" prop="establishDate">
                <el-date-picker
                  type="date"
                  placeholder="请选择"
                  class="proInputWidth"
                  v-model="ruleForm.establishDate"
                  value-format="yyyy-MM-dd"
                  clearable
                ></el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="登记机关" prop="registerAgency">
                <el-input
                  class="inputStyle"
                  show-word-limit
                  maxlength="100"
                  placeholder="请输入登记机关"
                  v-model.trim="ruleForm.registerAgency"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="实际地址">
                <el-input
                  class="inputStyle"
                  show-word-limit
                  maxlength="100"
                  placeholder="请输入实际地址"
                  v-model.trim="ruleForm.officeAddress"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="组成形式" prop="constituteForm">
                <el-select
                  v-model.trim="ruleForm.constituteForm"
                  clearable
                  filterable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in compositionFormArr"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="经营范围" prop="bussniseeScope">
                <el-input
                  class="inputProStyle"
                  show-word-limit
                  maxlength="500"
                  placeholder="请输入经营范围"
                  v-model.trim="ruleForm.bussniseeScope"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </template>
        <template v-if="ruleForm.departmentType === 0">
          <el-row>
            <el-col :span="12">
              <el-col :span="8" class="labelStyMin">
                <el-form-item label="联系人姓名" prop="transactor">
                  <el-input
                    v-model.trim="ruleForm.transactor"
                    clearable
                    placeholder="请输入"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="10" class="labelStyMax">
                <el-form-item label="联系人联系方式" prop="transactorTel">
                  <el-input
                    v-model.trim="ruleForm.transactorTel"
                    clearable
                    placeholder="请输入"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-col>
            <el-col :span="12">
              <el-col
                :span="9"
                style="padding-left: 0px; padding-right: 5px !important"
              >
                <el-form-item label="营业期限起" prop="expiryStartDate">
                  <el-date-picker
                    type="date"
                    placeholder="请选择"
                    class="proInputWidth areasSelect"
                    v-model="ruleForm.expiryStartDate"
                    @change="getTimeValue"
                    value-format="yyyy-MM-dd"
                    clearable
                  ></el-date-picker>
                </el-form-item>
              </el-col>
              <el-col
                :span="9"
                style="
                  padding-left: 0px;
                  padding-right: 5px !important;
                  margin-left: 5px;
                "
              >
                <el-form-item label="营业期限止" prop="expiryEndDate">
                  <el-date-picker
                    type="date"
                    placeholder="请选择"
                    class="proInputWidth areasSelect"
                    v-model="ruleForm.expiryEndDate"
                    @change="getTimeValue"
                    value-format="yyyy-MM-dd"
                    clearable
                  ></el-date-picker>
                </el-form-item>
              </el-col>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="成立日期" prop="establishDate">
                <el-date-picker
                  type="date"
                  placeholder="请选择"
                  class="proInputWidth"
                  v-model="ruleForm.establishDate"
                  value-format="yyyy-MM-dd"
                  clearable
                ></el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="登记机关" prop="registerAgency">
                <el-input
                  class="inputStyle"
                  show-word-limit
                  maxlength="100"
                  placeholder="请输入登记机关"
                  v-model.trim="ruleForm.registerAgency"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="注册地址" prop="registerAddress">
                <el-input
                  class="inputStyle"
                  show-word-limit
                  maxlength="100"
                  placeholder="请输入注册地址"
                  v-model.trim="ruleForm.registerAddress"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="注册资本" prop="registerCapital">
                <el-input
                  class="inputStyle"
                  v-model.trim="ruleForm.registerCapital"
                  clearable
                  placeholder="请输入"
                ></el-input
                >&nbsp;万元
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="本地详细办公地址">
                <el-input
                  class="inputStyle"
                  show-word-limit
                  maxlength="100"
                  placeholder="请输入本地详细办公地址"
                  v-model.trim="ruleForm.officeAddress"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-col :span="8" class="labelStyMin">
                <el-form-item label="座机号码" prop="landlineTelHead">
                  <el-input
                    v-model.trim="ruleForm.landlineTelHead"
                    clearable
                    placeholder="请输入"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="10" class="labelStyMax">
                <el-form-item label=" " prop="landlineTelNum">
                  <el-input
                    v-model.trim="ruleForm.landlineTelNum"
                    clearable
                    placeholder="请输入"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="营业范围" prop="bussniseeScope">
                <el-input
                  class="inputStyle"
                  show-word-limit
                  maxlength="500"
                  placeholder="请输入营业范围"
                  v-model.trim="ruleForm.bussniseeScope"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="邮箱" prop="email">
                <el-input
                  class="inputStyle"
                  show-word-limit
                  maxlength="100"
                  placeholder="请输入邮箱"
                  v-model.trim="ruleForm.email"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </template>
        <template v-if="pageType === 'edit'">
          <el-row>
            <el-col :span="12">
              <el-form-item label="账号用户名">
                <el-input
                  class="inputStyle"
                  :disabled="true"
                  v-model.trim="ruleForm.username"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="密保手机号" prop="securePhone">
                <el-input
                  class="inputStyle"
                  placeholder="请输入密保手机号"
                  v-model.trim="ruleForm.securePhone"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </template>
        <el-form-item class="submitBox">
          <el-button
            type="primary"
            @click="submitForm('ruleForm')"
            class="commonBut saveBtn"
            :loading="saveLoading"
            >{{ pageType === 'improve' ? '保存并下一步' : '保存' }}</el-button
          >
          <el-button @click="resetForm" class="commonBut">取消</el-button>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>
<script>
import { mapState, mapActions } from 'vuex'
export default {
  name: 'ImproveBasicInfo',
  props: {
    pageType: {
      type: String,
      default: '',
    },
    uscc: {
      type: String,
      default: '',
    },
  },
  data() {
    var legalName = (rule, value, callback) => {
      if (value && value.length > 10) {
        callback(new Error('请输入不超过10个字符'))
      } else {
        callback()
      }
    }
    var money = (rule, value, callback) => {
      let reg = /^[0-9]\d*(\.\d+)?$/
      if (value || value === '0') {
        if (!reg.test(value)) {
          callback(new Error('请输入正数'))
        } else if (value == 0) {
          callback(new Error('请输入正数'))
        } else {
          callback()
        }
      } else {
        callback()
      }
    }
    return {
      titleText: '基础信息',
      industryArr: [],
      belongsArr: [
        //归属
        { label: '本地', value: '1' },
        { label: '外地', value: '2' },
      ],
      companyTypeArr: [], //企业类型
      statusArr: [], //状态
      economicTypeArr: [], //经济类型
      affiliationArr: [], //隶属关系
      isEnum: [
        //枚举是否
        { label: '是', value: '1' },
        { label: '否', value: '0' },
      ],
      compositionFormArr: [
        //组成形式
        { label: '个人经营', value: '10' },
        { label: '家庭经营', value: '20' },
      ],
      ruleForm: {},
      rules: {
        companyType: [
          {
            required: true,
            message: '请选择企业类型',
            trigger: 'change',
          },
        ],
        status: [
          {
            required: true,
            message: '请选择状态',
            trigger: 'change',
          },
        ],
        economicType: [
          {
            required: true,
            message: '请选择经济类型',
            trigger: 'change',
          },
        ],
        affiliation: [
          {
            required: true,
            message: '请选择隶属关系',
            trigger: 'change',
          },
        ],
        isLaborDispatch: [
          {
            required: true,
            message: '请选择是否劳务派遣',
            trigger: 'change',
          },
        ],
        isUnionize: [
          {
            required: true,
            message: '请选择是否建立工会',
            trigger: 'change',
          },
        ],
        isContract: [
          {
            required: true,
            message: '请选择是否签订集体合同',
            trigger: 'change',
          },
        ],
        isProtocol: [
          {
            required: true,
            message: '请选择是否签订集体协议',
            trigger: 'change',
          },
        ],
        boss: [
          {
            required: true,
            message: '请输入法人姓名',
            trigger: 'blur',
          },
          {
            validator: legalName,
            trigger: 'blur',
          },
        ],
        bossTel: [
          {
            required: true,
            message: '请输入法人联系方式',
            trigger: 'blur',
          },
          {
            pattern: /^1[3456789]\d{9}$/,
            message: '请输入正确的手机号码',
            trigger: 'blur',
          },
        ],
        bossIdcard: [
          {
            required: true,
            message: '请输入法人身份证号',
            trigger: 'blur',
          },
          {
            pattern:
              /^(([1-9][0-9]{5}(19|20)[0-9]{2}((0[1-9])|(1[0-2]))([0-2][1-9]|10|20|30|31)[0-9]{3}([0-9]|X|x))|([1-9][0-9]{5}[0-9]{2}((0[1-9])|(1[0-2]))([0-2][1-9]|10|20|30|31)[0-9]{3}))$/,
            message: '请输入正确的身份证号',
            trigger: 'blur',
          },
        ],
        transactor: [
          {
            validator: legalName,
            trigger: 'blur',
          },
        ],
        transactorTel: [
          {
            pattern: /^1[3456789]\d{9}$/,
            message: '请输入正确的手机号码',
            trigger: 'blur',
          },
        ],
        registerCapital: [
          {
            validator: money,
            trigger: 'blur',
          },
        ],
        initialFund: [
          {
            validator: money,
            trigger: 'blur',
          },
        ],
        landlineTelHead: [
          {
            pattern: /^(0\d{2,3})$/,
            message: '请输入正确的座机号',
            trigger: 'blur',
          },
        ],
        landlineTelNum: [
          {
            pattern: /^\d{7,8}$/,
            message: '请输入正确的座机号',
            trigger: 'blur',
          },
        ],
        email: [
          {
            pattern: /^\w+@[a-zA-Z0-9]{2,10}(?:\.[a-z]{2,4}){1,3}$/,
            message: '请输入正确的邮箱地址',
            trigger: 'blur',
          },
        ],
        securePhone: [
          {
            required: true,
            pattern: /^1[3456789]\d{9}$/,
            message: '请输入正确的手机号码',
            trigger: 'blur',
          },
        ],
        name: [
          {
            required: true,
            message: '请输入单位名称',
            trigger: 'blur',
          },
        ],
        departmentType: [
          {
            required: true,
            message: '请选择单位类型',
            trigger: 'change',
          },
        ],
        industryId: [
          {
            required: true,
            message: '请选择所属行业',
            trigger: 'change',
          },
        ],
        belongs: [
          {
            required: true,
            message: '请选择归属',
            trigger: 'change',
          },
        ],
        regAreaId: [
          {
            required: true,
            message: '请选择注册区域',
            trigger: 'change',
          },
        ],
        bizAreaId: [
          {
            required: true,
            message: '请选择经营区域',
            trigger: 'change',
          },
        ],
        address: [
          {
            required: true,
            message: '请选择经营区域',
            trigger: 'change',
          },
        ],
      },
      updateLoading: false, //更新api按钮
      saveLoading: false, //保存按钮
      isShowUpdate: '',
      isDisabled: false,
      isShowRegArea: 0,
      isShowManaArea: 0,
      outAreasOptions: [], //省外省市
      neiAreasOptions: [], //内蒙省市
      regAreasOptions: [],
      regAreaId: '',
      bizAreaId: '',
      address: '',
    }
  },
  async created() {
    this.saveLoading = true
    if (
      this.pageType === 'edit' &&
      localStorage.getItem('judgeRoleCode') == 'company'
    ) {
      this.isDisabled = false
    } else {
      this.isDisabled = true
    }
    await this.selectOutAreas('3')
    await this.getTypeList('COMPANY_ECONOMIC_TYPE')
    await this.getTypeList('NC_COMPANY_TYPE')
    await this.getTypeList('NC_COMPANY_STATUS')
    await this.getTypeList('NC_COMPANY_AFFILIATION')
    await this.getEnterpriseInfo()
  },
  computed: { ...mapState(['industryOptionsNC']) },
  methods: {
    // 获取最新接口信息
    getApiInfo() {
      let data = { uscc: this.ruleForm.uscc }
      let url = 'api-c/company/expand/findenterpriseinformation'
      if (
        this.ruleForm.departmentType === '5' ||
        this.ruleForm.departmentType === '10'
      ) {
        //事业单位
        url = 'api-c/company/expand/findinstitutioninformation'
        data = { usccOrName: this.ruleForm.uscc }
      }
      this.updateLoading = true
      const CancelToken = axios.CancelToken
      let cancel
      let timer = setTimeout(() => {
        cancel()
        this.$message.error('连接超时，请检查网络！')
      }, 10000)
      return this.axios({
        method: 'post',
        url,
        data,
        cancelToken: new CancelToken(function executor(c) {
          cancel = c
        }),
      })
        .then((response) => {
          this.updateLoading = false
          clearTimeout(timer)
          if (!response.data.hasError) {
            this.$message.success('数据获取成功！')
            const results = response.data.result
            this.ruleForm.boss = results.boss
            this.ruleForm.expiryStartDate = results.expiryStartDate
            this.ruleForm.expiryEndDate = results.expiryEndDate
            this.ruleForm.bussniseeScope = results.bussniseeScope
            this.ruleForm.registerAddress = results.registerAddress
            if (this.ruleForm.departmentType === 0) {
              this.ruleForm.companyType = results.companyType
              this.ruleForm.status = results.status
              this.ruleForm.establishDate = results.establishDate
              this.ruleForm.registerAgency = results.registerAgency
              this.ruleForm.registerCapital = results.registerCapital
            } else {
              this.ruleForm.fundsSources = results.fundsSources
              this.ruleForm.sponsor = results.sponsor
              this.ruleForm.initialFund = results.initialFund
              this.ruleForm.fundsSources = results.fundsSources
            }
          } else {
            this.$message.error('数据获取失败！')
          }
        })
        .catch((error) => {
          this.updateLoading = false
          clearTimeout(timer)
          if (error.response) {
            this.$message.error('数据获取失败！')
          }
        })
    },
    // 取消跳转档案详情页
    resetForm() {
      if (
        this.$store.state.userType === 'MONITOR' ||
        this.$store.state.userType === 'AREAMANAGE'
      ) {
        this.$router.push({
          path: '/home/enterpriseSet/employerRecordDetail',
          name: 'employerRecordDetail',
          query: {
            companyId: this.ruleForm.id,
            routeName: this.$route.query.routeName,
          },
        })
        let oldUrl = null
        if (this.$route.query.routeName === 'employerInfoList') {
          oldUrl = '/home/enterpriseSet/employerInfoList'
        }
        if (this.$route.query.routeName === 'enterpriseArchives') {
          oldUrl = '/home/enterpriseSet/employerRecordList'
        }
        this.$store.commit('CHANGE_SLIDER_NAME', {
          oldUrl,
          newUrl: this.$router.currentRoute.fullPath,
        })
      } else {
        this.$router.push({
          path: '/home/enterpriseSet/employerRecordDetail',
          name: 'employerRecordDetail',
        })
        this.$store.commit('CHANGE_SLIDER_NAME', {
          oldUrl: '/home/enterpriseSet/employerRecordDetail',
          newUrl: this.$router.currentRoute.fullPath,
        })
      }
    },
    // 获取单位档案信息
    getEnterpriseInfo() {
      let data = {}
      // if(this.$store.state.userType === 'MONITOR'){
      data.uscc = this.uscc ? this.uscc : ''
      // }
      return this.axios({
        method: 'post',
        url: 'api-c/company/expand/findCompanyDetail',
        data,
      })
        .then((response) => {
          this.saveLoading = false
          if (!response.data.hasError) {
            const results = response.data.result
            this.ruleForm = results
            this.ruleForm.industryId = results.industryList
            this.ruleForm.regAreaId = results.regAreaList
            this.ruleForm.bizAreaId = results.bizAreaList

            // this.ruleForm.regAreaId = results.regAreaId;
            // this.ruleForm.bizAreaId = results.bizAreaId
            if (this.ruleForm.belongs == '1') {
              this.ruleForm.address = results.bizAreaList
              this.selectOutAreas('1')
            } else {
              this.selectOutAreas('2')
            }
          } else {
            this.$message.error(response.data.errorMsg)
          }
        })
        .catch((error) => {
          if (error.response) {
            this.$message.error(error.response.data)
          }
          this.saveLoading = false
        })
    },
    // 保存基础信息
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.saveLoading = true

          //保存接口出错
          delete this.ruleForm.regulationsFiles
          delete this.ruleForm.laborDispatchFiles
          delete this.ruleForm.unionReplyFiles
          delete this.ruleForm.collectiveContractFiles
          delete this.ruleForm.salaryAgreementFiles
          delete this.ruleForm.businessLicenseImgFile
          delete this.ruleForm.bossIDCardFrontImgFile
          delete this.ruleForm.bossIDCardBackImgFile
          delete this.ruleForm.affiltatedCertificateFile
          delete this.ruleForm.companyExpendVO
          delete this.ruleForm.bizAreaList
          delete this.ruleForm.regAreaList
          delete this.ruleForm.industryList

          if (Array.isArray(this.ruleForm.industryId)) {
            this.ruleForm.industryId = this.ruleForm.industryId.pop()
          }

          if (this.ruleForm.belongs == '2') {
            if (Array.isArray(this.ruleForm.bizAreaId)) {
              this.ruleForm.bizAreaId = this.ruleForm.bizAreaId.pop()
            }
          } else {
            if (Array.isArray(this.ruleForm.address)) {
              this.ruleForm.bizAreaId = this.ruleForm.address.pop()
            }
          }
          if (Array.isArray(this.ruleForm.regAreaId)) {
            this.ruleForm.regAreaId = this.ruleForm.regAreaId.pop()
          }

          this.axios({
            method: 'post',
            url: 'api-c/company/expand/modifycompanydetail',
            data: this.ruleForm,
          })
            .then((response) => {
              this.saveLoading = false
              if (!response.data.hasError) {
                this.$message({
                  type: 'success',
                  message: '保存成功',
                })
                if (
                  this.$store.state.userType === 'MONITOR' ||
                  this.$store.state.userType === 'AREAMANAGE'
                ) {
                  this.$router.push({
                    path: '/home/enterpriseSet/employerRecordDetail',
                    name: 'employerRecordDetail',
                    query: {
                      companyId: this.ruleForm.id,
                      routeName: this.$route.query.routeName,
                    },
                  })
                  let oldUrl = null
                  if (this.$route.query.routeName === 'employerInfoList') {
                    oldUrl = '/home/enterpriseSet/employerInfoList'
                  }
                  if (this.$route.query.routeName === 'enterpriseArchives') {
                    oldUrl = '/home/enterpriseSet/employerRecordList'
                  }
                  this.$store.commit('CHANGE_SLIDER_NAME', {
                    oldUrl,
                    newUrl: this.$router.currentRoute.fullPath,
                  })
                } else {
                  this.$emit('changeActive', 1)
                }
              } else {
                this.$message.error(response.data.errorMsg)
              }
            })
            .catch((error) => {
              this.saveLoading = false
              if (error.response) {
                this.$message.error(error.response.data)
              }
            })
        } else {
          this.$message({
            type: 'error',
            message: '请按照提示规则输入内容',
          })
          return false
        }
      })
    },
    // 日期控件提示
    getTimeValue() {
      if (this.ruleForm.expiryStartDate && this.ruleForm.expiryEndDate) {
        if (this.ruleForm.expiryStartDate > this.ruleForm.expiryEndDate) {
          this.$message({
            message: '开始日期不能大于结束日期',
            type: 'warning',
          })
        }
      }
    },
    // 字典
    getTypeList(type) {
      return this.axios({
        method: 'post',
        data: { type },
        url: 'api-bs/base/dicitem/findbytype',
      })
        .then((response) => {
          if (!response.data.hasError) {
            if (type === 'COMPANY_ECONOMIC_TYPE') {
              this.economicTypeArr = response.data.result
            } else if (type === 'NC_COMPANY_TYPE') {
              this.companyTypeArr = response.data.result
            } else if (type === 'NC_COMPANY_STATUS') {
              this.statusArr = response.data.result
            } else if (type === 'NC_COMPANY_AFFILIATION') {
              this.affiliationArr = response.data.result
            }
          } else {
            this.$message.error(response.data.errorMsg)
          }
        })
        .catch((error) => {
          if (error.response) {
            this.$message.error(error.response.data)
          }
        })
    },
    //改变企业归属
    changeBelong(value) {
      //（本省：1，外省：2）
      if (value === '1') {
        ++this.isShowRegArea
        this.selectOutAreas('1')
        this.ruleForm.address = []
        // this.$refs.ruleForm.validateField("address", Error => {});
      } else {
        ++this.isShowRegArea
        ++this.isShowManaArea
        this.selectOutAreas('2')
        this.ruleForm.bizAreaId = []
        // this.$refs.ruleForm.validateField("bizAreaId", Error => {});
      }
      this.ruleForm.regAreaId = []
      // this.$refs.ruleForm.validateField("regAreaId", Error => {});
    },
    selectOutAreas(type) {
      let vm = this
      //（本省：1，外省：2）
      var belongs
      if (type == '1' || type == '3') {
        belongs = 1
      } else {
        belongs = 2
      }
      vm.axios({
        method: 'post',
        url: 'api-bs/areadic/base/areas',
        data: {
          belongs: belongs,
          areaId: this.$store.state.areaInfoArr.areaId,
        },
      })
        .then((res) => {
          if (!res.data.hasError) {
            ++vm.isShowRegArea
            ++vm.isShowManaArea
            if (type == '3') {
              vm.areasOptions = res.data.result
            } else {
              vm.regAreasOptions = res.data.result
            }
          } else {
            this.$message({
              showClose: true,
              duration: 3000,
              message: '获取区域数据失败',
              type: 'error',
            })
          }
        })
        .catch((error) => {
          this.$message({
            showClose: true,
            duration: 3000,
            message: '获取区域数据失败',
            type: 'error',
          })
        })
    },
    //本省企业经营地址等于注册地址
    handerChange(item) {
      this.ruleForm.address = item
      this.$refs.ruleForm.validateField('address')
    },
  },
}
</script>
<style scoped lang="less">
.container {
  .infoContent {
    padding-top: 24px;
    .labelStyMin {
      padding-left: 0px !important;
      min-width: 130px;
    }
    .labelStyMax {
      padding-left: 10px !important;
      padding-right: 0px !important;
      // margin-left: 5px;
      min-width: 155px;
    }
    .submitBox {
      text-align: center;
      margin-top: 40px;
    }
    .picBox {
      margin-right: 60px;
      .picStyle {
        width: 116px;
        height: 116px;
        .imgStyle {
          width: 100%;
          height: 100%;
        }
      }
      .picTipStyle {
        text-align: center;
      }
    }

    /deep/ .el-row {
      margin-left: 10% !important;
    }
  }
  .proInputWidth {
    width: 75%;
  }
  .el-row {
    margin-bottom: 15px;
    &:last-child {
      margin-bottom: 0;
    }
  }

  .bg-purple {
    background: #d3dce6;
  }

  .row-bg {
    padding: 10px 0;
    background-color: #fff;
  }
  .inputStyle {
    width: 75%;
    min-width: 280px;
    height: 36px;
  }
  .inputProStyle {
    width: 85%;
  }
  .el-form-item {
    margin-bottom: 0px !important;
  }
  /deep/ .el-form-item__label {
    float: inherit !important;
  }
  /deep/ .el-form-item__content {
    margin-left: 0 !important;
  }

  .el-button--primary {
    background-color: #009588;
    border-color: #009588;
  }
  .el-select {
    width: 75% !important;
  }
  .el-cascader {
    width: 75% !important;
  }
}
.container .areasSelect {
  width: 100% !important;
}
</style>
